<template>
  <Dialog :title="dialogTitle" v-model="dialogVisible">
    <el-form
      ref="formRef"
      :model="formData"
      :rules="formRules"
      label-width="120px"
      v-loading="formLoading"
    >
      <el-form-item label="就诊人" prop="patientName">
        <el-input disabled v-model="formData.patientName" placeholder="请输入就诊人姓名" />
      </el-form-item>
      <el-form-item label="检查日期" prop="examinationDate">
        <el-date-picker
          v-model="formData.examinationDate"
          type="date"
          value-format="YYYY-MM-DD"
          placeholder="选择检查日期"
        />
      </el-form-item>
      <el-form-item label="检查项目" prop="examinationProject">
        <el-input v-model="formData.examinationProject" placeholder="请输入检查项目" />
      </el-form-item>
      <el-form-item label="症状" prop="symptom">
        <el-select v-model="formData.symptom" multiple placeholder="请选择症状">
          <el-option label="尿频" value="尿频" />
          <el-option label="尿痛" value="尿痛" />
          <el-option label="排尿困难" value="排尿困难" />
        </el-select>
      </el-form-item>
      <el-form-item label="ALT" prop="alt">
        <el-input v-model="formData.alt" placeholder="请输入ALT" />
      </el-form-item>
      <el-form-item label="AST" prop="ast">
        <el-input v-model="formData.ast" placeholder="请输入AST" />
      </el-form-item>
      <el-form-item label="Cr" prop="cr">
        <el-input v-model="formData.cr" placeholder="请输入Cr" />
      </el-form-item>
      <el-form-item label="BUN" prop="bun">
        <el-input v-model="formData.bun" placeholder="请输入BUN" />
      </el-form-item>
      <el-form-item label="PSA" prop="psa">
        <el-input v-model="formData.psa" placeholder="请输入PSA" />
      </el-form-item>
      <el-form-item label="睾酮" prop="testosterone">
        <el-input v-model="formData.testosterone" placeholder="请输入睾酮" />
      </el-form-item>
      <el-form-item label="WBC" prop="wbc">
        <el-input v-model="formData.wbc" placeholder="请输入WBC" />
      </el-form-item>
      <el-form-item label="Hb" prop="hb">
        <el-input v-model="formData.hb" placeholder="请输入Hb" />
      </el-form-item>
      <el-form-item label="Plt" prop="plt">
        <el-input v-model="formData.plt" placeholder="请输入Plt" />
      </el-form-item>
      <el-form-item label="B超" prop="bbUltrasound">
        <el-select v-model="formData.bbUltrasound" multiple placeholder="请选择B超">
          <el-option label="精囊腺" value="精囊腺" />
          <el-option label="直肠" value="直肠" />
          <el-option label="膀胱" value="膀胱" />
        </el-select>
      </el-form-item>
      <el-form-item label="MRI" prop="mri">
        <el-select v-model="formData.mri" multiple placeholder="请选择MRI">
          <el-option label="包膜" value="包膜" />
          <el-option label="精囊腺" value="精囊腺" />
          <el-option label="淋巴结" value="淋巴结" />
        </el-select>
      </el-form-item>
      <el-form-item label="PSMA" prop="psma">
        <el-select v-model="formData.psma" multiple placeholder="请选择PSMA">
          <el-option label="肝脏" value="肝脏" />
          <el-option label="肺" value="肺" />
          <el-option label="淋巴结" value="淋巴结" />
          <el-option label="骨" value="骨" />
        </el-select>
      </el-form-item>
      <el-form-item label="ECOG 体能评分" prop="ecog">
        <el-select v-model="formData.ecog" multiple placeholder="请选择ECOG 体能评分">
          <el-option label="活动能力完全正常，与起病前活动能力无任何差异。" value="0" />
          <el-option label="能自由走动及从事轻体力活动，包括一般家务或办公室工作，但不能从事较重的体力活动。" value="1" />
          <el-option label="能自由走动及生活自理，但已丧失工作能力，日间不少于一半时间可以起床活动。" value="2" />
          <el-option label="生活仅能部分自理，日间一半以上时间卧床或轮椅。" value="3" />
          <el-option label="卧床不起，生活不能自理。" value="4" />
          <el-option label="死亡。" value="5" />
        </el-select>
      </el-form-item>
      <el-form-item label="盆底功能锻炼" prop="pdgndl">
        <el-radio-group v-model="formData.pdgndl">
          <el-radio value="有">有</el-radio>
          <el-radio value="无">无</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="骨转移" prop="gzy">
        <el-radio-group v-model="formData.gzy">
          <el-radio value="有">有</el-radio>
          <el-radio value="无">无</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
      <el-button @click="dialogVisible = false">取 消</el-button>
    </template>
  </Dialog>
</template>
<script setup lang="ts">
import { PatientSqpgApi, PatientSqpg } from '@/api/business/patientsqpg'

/** 术前评估 表单 */
defineOptions({ name: 'PatientSqpgForm' })

const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗

const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref({
  id: undefined,
  patientId: undefined,
  patientName: undefined,
  doctorId: undefined,
  doctorName: undefined,
  examinationDate: undefined,
  examinationProject: undefined,
  symptom: undefined,
  alt: undefined,
  ast: undefined,
  cr: undefined,
  bun: undefined,
  psa: undefined,
  testosterone: undefined,
  wbc: undefined,
  hb: undefined,
  plt: undefined,
  bbUltrasound: undefined,
  mri: undefined,
  psma: undefined,
  ecog: undefined,
  pdgndl: undefined,
  gzy: undefined,
})
const formRules = reactive({
  patientId: [{ required: true, message: '就诊人ID不能为空', trigger: 'blur' }],
  patientName: [{ required: true, message: '就诊人姓名不能为空', trigger: 'blur' }],
  doctorId: [{ required: true, message: '录入医生ID不能为空', trigger: 'blur' }],
  doctorName: [{ required: true, message: '录入医生姓名（冗余）不能为空', trigger: 'blur' }],
})
const formRef = ref() // 表单 Ref

/** 打开弹窗 */
const open = async (type: string, patientName: string, patientId: number, id?: number) => {
  dialogVisible.value = true
  dialogTitle.value = t('action.' + type)
  formType.value = type
  resetForm()
  formData.value.patientId = patientId
  formData.value.patientName = patientName
  // 修改时，设置数据
  if (id) {
    formLoading.value = true
    try {
      formData.value = await PatientSqpgApi.getPatientSqpg(id)
    } finally {
      formLoading.value = false
    }
  }
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗

/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
  // 校验表单
  await formRef.value.validate()
  // 提交请求
  formLoading.value = true
  try {
    const data = formData.value as unknown as PatientSqpg
    if (formType.value === 'create') {
      await PatientSqpgApi.createPatientSqpg(data)
      message.success(t('common.createSuccess'))
    } else {
      await PatientSqpgApi.updatePatientSqpg(data)
      message.success(t('common.updateSuccess'))
    }
    dialogVisible.value = false
    // 发送操作成功的事件
    emit('success')
  } finally {
    formLoading.value = false
  }
}

/** 重置表单 */
const resetForm = () => {
  formData.value = {
    id: undefined,
    patientId: undefined,
    patientName: undefined,
    doctorId: undefined,
    doctorName: undefined,
    examinationDate: undefined,
    examinationProject: undefined,
    symptom: undefined,
    alt: undefined,
    ast: undefined,
    cr: undefined,
    bun: undefined,
    psa: undefined,
    testosterone: undefined,
    wbc: undefined,
    hb: undefined,
    plt: undefined,
    bbUltrasound: undefined,
    mri: undefined,
    psma: undefined,
    ecog: undefined,
    pdgndl: undefined,
    gzy: undefined,
  }
  formRef.value?.resetFields()
}
</script>
